<!DOCTYPE html>
<html
  layout:decorator="components/layout"
  xmlns="http://www.w3.org/1999/xhtml"
  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
>
<head>
  <title>基础代码</title>
</head>
<body>
<div
  layout:fragment="content"
  id="app" v-cloak
>
  <div class="container">
    <div class="myHeader">
      <div class="myHeader-title">
        基础代码
      </div>
      <div class="myHeader-tool">

        <el-form inline>
          <el-form-item label-width="0px">
            <el-button
              type="primary"
              size="mini"
              @click="addInfo"
              v-realm="'system-configuration:sys-base-code:edit'"
            >新增
            </el-button>
          </el-form-item>
          <el-form-item label="名称:">
            <el-input
              v-model="form.name"
              clearable
              size="mini"
              show-word-limit
              maxlength="64"
            ></el-input>
          </el-form-item>
          <el-form-item label-width="0px">
            <el-button size="mini" type="primary" icon="el-icon-search" @click="searchPage"></el-button>
          </el-form-item>

          <el-form-item label-width="0px">
            <el-select v-model="form.typeAction" @change="typeActionChange" placeholder="请选择" size="mini" clearable>
              <el-option v-for="[key,val] in fieldFormatter.sysField.typeMap" :label="val" :key="key" :value="key">
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>

      </div>
    </div>
    <!--内容-->
    <my-table
      :data="page.records"
      :columns="columns"
      @handle-selection-change="selection"
      @handle-sort-change="sortChange"
    >
      <template #operating="scope">
          <span>
              <el-button
                size="mini"
                type="primary"
                @click.stop.prevent="() => updateInfo(scope.row)"
                v-realm="'system-configuration:sys-base-code:edit'"
              >修改</el-button>
          </span>
          <span>
            <el-button
              size="mini"
              type="primary"
              @click.stop.prevent="() => del(scope.row)"
              v-realm="'system-configuration:sys-base-code:edit'"
            >删除</el-button>
          </span>
      </template>
      <template #status="scope">
          <span>
              <img
                border="0"
                :src="statusImg(scope.row.status)"
                v-realm="'system-configuration:sys-base-code:edit'"
              >
          </span>
      </template>

    </my-table>
    <div class="pagination">
      <el-pagination
        background
        @size-change="changeSize"
        @current-change="goto"
        :current-page="page.current"
        :page-sizes="[10, 20, 30]"
        :page-size="page.size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="page.total"
      >
      </el-pagination>
    </div>

    <el-dialog
      :title="dtitle"
      width="30%"
      :visible.sync="updateVisible"
    >
      <el-form :model="sysBaseCode">
        <el-form-item
          label="名称:"
          :label-width="formLabelWidth"
        >
          <el-input v-model="sysBaseCode.name"></el-input>
        </el-form-item>
        <el-form-item
          v-show="isAdd"
          label="键值:"
          :label-width="formLabelWidth"
        >
          <el-input v-model="sysBaseCode.code"></el-input>
        </el-form-item>
        <el-form-item
          label="状态:"
          :label-width="formLabelWidth"
        >
          <el-select
            v-model="sysBaseCode.status"
            placeholder="请选择"
          >
            <el-option
              v-for="[k,v] in fieldFormatter.sysField.statusMap"
              :key="k"
              :label="v"
              :value="k"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="排序:"
          :label-width="formLabelWidth"
        >
          <el-input v-model="sysBaseCode.order"></el-input>
        </el-form-item>
        <el-form-item
          label="父类:"
          :label-width="formLabelWidth"
        >
          <!--<rx-select-tree-->
          <!--:options="parentCodeTree"-->
          <!--v-model="sysBaseCode.parent"-->
          <!--:props="defaultProps"-->
          <!--&gt;</rx-select-tree>-->
          <el-select
            v-model="sysBaseCode.parent"
            placeholder="请选择"
          >
            <el-option
              v-for="[k,v] in parentCodeMap"
              :key="k"
              :label="v"
              :value="k"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="备注:"
          :label-width="formLabelWidth"
        >
          <el-input v-model="sysBaseCode.comments"></el-input>
        </el-form-item>
      </el-form>
      <div
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="updateVisible = false">取 消</el-button>
        <el-button
          type="primary"
          @click="updateOrAddData"
          v-realm="'system-configuration:sys-base-code:edit'"
        >确 定
        </el-button>
      </div>
    </el-dialog>
  </div>
</div>
<div layout:fragment="js">
  <link
    rel="stylesheet"
    href="/static/css/rx-select-tree.css"
  />
  <script src="/static/js/component/RxSelectTree.js"></script>
  <script src="/static/js/module/system-config/model/SysBaseCode.js"></script>
  <script src="/static/js/module/system-config/api/SysBaseCodeApi.js"></script>
  <script src="/static/js/module/system-config/admin_sysfield.js"></script>
</div>
</body>
</html>
